<template>
  <common-dialog title="角色人员查看" :visible.sync="roleViewVisible" :type="type">
    <hzhy-data-table ref="dataTable" v-bind="tableConfig"> </hzhy-data-table>
  </common-dialog>
</template>

<script>
import CommonDialog from '@/components/common-dialog'
import { VALID_STATE } from '@/const/system'

export default {
  components: {
    CommonDialog,
  },
  props: {
    // 是否显示侧边栏
    visible: {
      type: Boolean,
      default: false,
    },
    roleViewUrl: {
      type: String,
      default: null,
    },
    roleId: {
      type: String,
      default: null,
    },
    curTenantId: {
      type: String,
      default: null,
    },
  },
  data() {
    return {
      type: 'alert',
      tableConfig: {
        customQuery: {
          roleId: this.roleId,
        },
        url: this.roleViewUrl,
        showSaveQuery: false,
        columns: [
          {
            label: '序号',
            type: 'index',
            prop: 'index',
            fixed: 'left',
          },
          {
            label: '性别',
            prop: 'sex',
            formatter: ({ sex }) => (sex === 1 ? '男' : '女'),
          },
          {
            label: '邮箱',
            prop: 'accountEmail',
          },
          {
            label: '姓名',
            prop: 'name',
          },
          {
            label: '电话',
            prop: 'phone',
          },
          {
            label: '公司',
            prop: 'company',
          },
          {
            label: '国家/地区',
            prop: 'country',
          },
        ],
        searchForm: [
          {
            $type: 'input',
            $id: 'name',
            label: '登录名/姓名',
            $el: {
              clearable: true,
              placeholder: '请输入',
            },
          },
          {
            $type: 'select',
            $id: 'state',
            label: '是否有效',
            $options: VALID_STATE.options(),
            $el: {
              clearable: true,
              placeholder: '请输入',
            },
          },
        ],
      },
    }
  },
  computed: {
    roleViewVisible: {
      get(val) {
        return this.visible
      },
      set(val) {
        this.$emit('update:visible', val)
      },
    },
  },
  methods: {},
}
</script>

<style lang="less" scoped></style>
